// global 
var html = {};

html.template = '<div class="template"><div class="name"></div><img class="thumb" /><div class="tagLine"></div></div>';

html.comList = '<div class="component"><div class="title"></div><div class="pages"></div><div class="clear" /></div>'

var jq = {};
var events = {};

// mask
var showMask = function (type) { 
  if (jq.mask.css('display') == 'none') {
    jq.mask.fadeIn('fast'); 
  } else {
    jq.mask.children('div').hide();
  }
  if (!type) type = 'loading';
  jq.mask.find('.' + type).show();
  jq.mask.css('cursor', (type == 'loading') ? 'wait' : 'default');
};
var hideMask = function () { 
  jq.mask.fadeOut('fast'); 
  jq.mask.find('.content').html('');
};

// menu
var makeMenuOn = function () {
  jq.subMenu.css('left', jq.makeMenu.offset().left + 5);
  jq.subMenu.show();
};
var makeMenuOff = function () {
  jq.subMenu.hide();
};

var subMenuOn = function (evt) {
  $(evt.target).addClass('active');
};
var subMenuOff = function (evt) {
  $(evt.target).removeClass('active');
}

// register
events.registerMenu = function () {
  jq.makeMenu.hover(makeMenuOn, makeMenuOff);
  jq.subMenu.find('li').hover(subMenuOn, subMenuOff);
};

events.registerMask = function () {
  jq.mask.find('.cancel').click( hideMask );
};

// register events
$( function () {
  jq.makeMenu = $('.mainMenu li.make');
  jq.subMenu = $('.subMenu');
  jq.mask = $('.mask');
  jq.content = jq.mask.find('.content');
  jq.makeZone = $('.makeZone');
  jq.hoverMenu = $('.hoverMenu');
  jq.list = $('.comList');
  jq.form = $('.comEdit');
  jq.title = jq.form.find('.title');
  jq.resource = jq.form.find('.resource');
  jq.body = jq.form.find('.body');

  $.each(events, function (k, f) {
    f();
  });
});
